<template>
  <div id="egImg">
    <!-- 达人对比 -->
    <img
      :src="$global.staticUrl + 'image/egImg/talentCompare.jpg'"
      v-if="$route.params.id == 'compare'"
    />
    <!-- 达人详情 -->
    <!-- 达人粉丝画像 -->
    <img
      :src="$global.staticUrl + 'image/egImg/FansPortrait1.jpg'"
      v-if="$route.params.id == 'FansPortrait'"
    />
    <!-- 电商数据分析 -->
    <img
      :src="$global.staticUrl + 'image/egImg/Ecommerce1.jpg'"
      v-if="$route.params.id == 'Ecommerce'"
    />
    <!-- 直播记录 -->
    <img
      :src="$global.staticUrl + 'image/egImg/liveRecord1.jpg'"
      v-if="$route.params.id == 'liveRecord'"
    />
    <!-- 直播带货分析 -->
    <img
      :src="$global.staticUrl + 'image/egImg/liveGoodsData1.jpg'"
      v-if="$route.params.id == 'liveGoodsData'"
    />
    <!-- 商品详情 -->
    <!-- 关联视频分析 -->
    <img
      :src="$global.staticUrl + 'image/egImg/tik_tok1.jpg'"
      alt=""
      v-if="$route.params.id == 'tik_tok'"
    />
    <!-- 在售达人分析 -->
    <img
      :src="$global.staticUrl + 'image/egImg/sale1.jpg'"
      v-if="$route.params.id == 'sale'"
    />
    <!-- 关联直播分析 -->
    <img
      :src="$global.staticUrl + 'image/egImg/live1.png'"
      v-if="$route.params.id == 'asslive'"
    />
    <!-- 商品观众画像 -->
    <img
      :src="$global.staticUrl + 'image/egImg/goodsAuPortrait1.jpg'"
      v-if="$route.params.id == 'goodsAuPortrait'"
    />
    <!-- 直播详情 -->
    <!-- 直播数据分析 -->
    <img
      :src="$global.staticUrl + 'image/egImg/liveData1.jpg'"
      v-if="$route.params.id == 'liveData'"
    />
    <!-- 直播商品分析 -->
    <img
      :src="$global.staticUrl + 'image/egImg/liveGoods1.jpg'"
      v-if="$route.params.id == 'liveGoods'"
    />
    <!-- 直播观众分析 -->
    <img
      :src="$global.staticUrl + 'image/egImg/audience1.jpg'"
      v-if="$route.params.id == 'audience'"
    />
    <!-- 直播大屏 -->
    <img
      :src="$global.staticUrl + 'image/egImg/livebig2.png'"
      v-if="$route.params.id == 'liveEg'"
    />
    <!-- 智能匹配 -->
    <img
      src="@/assets/shi/seekTalentDetails.png"
      v-if="$route.params.id == 'matchEg'"
    />
    <img
      :src="$global.staticUrl + 'image/exampleIcon.png'"
      class="egImg"
      v-if="$route.params.id != 'matchEg' && $route.params.id != 'sample'"
    />
    <img
      :src="$global.staticUrl + 'image/exampleIcon.png'"
      class="egImg1"
      v-if="$route.params.id != 'matchEg' && $route.params.id != 'sample'"
    />
    <img
      :src="$global.staticUrl + 'image/egImg/znfxEg.png'"
      class="egImg2"
      v-if="$route.params.id == 'matchEg'"
    />
    <img
      :src="$global.staticUrl + 'image/egImg/znfxEg.png'"
      class="egImg3"
      v-if="$route.params.id == 'matchEg'"
    />
    <img
      :src="$global.staticUrl + 'image/egImg/sample.png'"
      v-if="$route.params.id == 'sample'"
    />
  </div>
</template>

<script>
export default {
  name: "",
  components: {},
  data() {
    return {};
  },
  computed: {},
  watch: {},
  created() {
    console.log("id", this.$route.params.id);
  },
  mounted() {},

  methods: {}
};
</script>
<style lang="less" scoped>
#egImg {
  background-color: #f1f1f1;
  min-height: 100vh;
  overflow: hidden;
  position: relative;
  img {
    display: block;
    margin: 14px auto;
  }
  .egImg {
    width: 180px;
    height: 58.58px;
    position: absolute;
    left: 50%;
    top: 200px;
    transform: translate(-50%, 50%);
    opacity: 0.7;
  }
  .egImg1 {
    width: 180px;
    height: 58.58px;
    position: absolute;
    left: 50%;
    bottom: 300px;
    transform: translate(-50%, 50%);
  }
  .egImg2 {
    position: absolute;
    left: 50%;
    top: 200px;
    transform: translate(-50%, 50%);
  }
  .egImg3 {
    position: absolute;
    left: 50%;
    bottom: 300px;
    transform: translate(-50%, 50%);
  }
}
</style>
